<template>
     <el-dialog :close-on-click-modal="false"  :close-on-press-escape="false"  v-loading="loading" title="编辑" :append-to-body="true" :visible="modalEdit" @close="modalEdit=false"  @opened="opened" @closed="closed" >
        <el-tree ref="roleTree" :default-checked-keys="auths" :props="options" :data="sysMenus" show-checkbox node-key="id" default-expand-all :expand-on-click-node="false">
            <span class="custom-tree-node" slot-scope="{ node, data }">
                <span>{{ node.label }}</span>
            </span>
        </el-tree>
        <div slot="footer">
            <el-button @click="cancel">取消</el-button>
            <el-button type="primary" :loading="modalLoading" @click="ok">确定权限</el-button>
        </div>
    </el-dialog>
</template>
<script>
export default {
    name: 'SysRole',
    data() {
        return {
            options: {
                label: "title",
                children: "childs"
            },
            loading:false,
            modalEdit: false,
            modalLoading: false,
            auths: [],
            roleId: null,
            sysMenus: []
        };
    },
    mounted: function() {


    },
    methods: {
        getList: function() {
            var me = this;

            me.loading = true;
            me.$http.post("/sys/sysmenu/getall.action", {}).then(response => {
                var body = response;
                if (body.status == 0) {

                    me.sysMenus = body.obj;
                    // me.$refs['roleTree'].setCheckedNodes(me.auths);
                }
                me.loading = false;
            }, response => {
                me.loading = false;
            });
        },
        opened() {

            if (this.sysMenus.length <= 0) {
                this.getList();
            } else {
                // this.$refs['roleTree'].setCheckedNodes(this.auths);
            }
        },
        closed: function() {
            this.auths = [];
            this.roleId = null;
			this.$refs['roleTree'].setCheckedKeys([]);
        },
        showDialog(auths, roleId) {
            this.auths = JSON.parse(auths);
            //  debugger

            this.roleId = roleId;
            this.modalEdit = true;
        },

        ok: function() {


            var me = this;
            let ids = me.$refs['roleTree'].getCheckedKeys();
            me.modalLoading = true;
            me.$http.post("/sys/sysrole/doAuth.action", { id: me.roleId, auths: JSON.stringify(ids) }).then(response => {
                var body = response;
                if (body.status == 0) {
                    me.successMessage("保存成功！");
                    me.modalEdit = false;
                    me.$emit("ok");

                } else {
                    me.errorMessage(body.info);
                }
                me.modalLoading = false;
            }, response => {
                me.modalLoading = false;
            });
        },
        cancel: function() {

            this.modalEdit = false;
            this.$emit("cancel");
        }
    }
}
</script>
<style scoped>
</style>